﻿<UserControl x:Class="FloydPink.Flickr.Downloadr.UI.Controls.Spinner"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             mc:Ignorable="d"
             d:DesignHeight="300" d:DesignWidth="300">
    <Grid>
        <Rectangle Fill="White" Opacity="0.85" />
        <Canvas Name="SpinningProgress" Margin="0,0,0,100" Height="130" Width="130"
                VerticalAlignment="Center" HorizontalAlignment="Center">
            <Canvas Name="InnerCanvas" Height="110" Width="110" VerticalAlignment="Center"
                    HorizontalAlignment="Center" Canvas.Left="10" Canvas.Top="10">
                <Ellipse Margin="45,-5,0,0" Name="EllipseLarge" Stroke="DeepSkyBlue" Height="20" Width="20"
                         VerticalAlignment="Top" Fill="DeepPink" HorizontalAlignment="Left" />
                <Ellipse Margin="85.3553,14.6447,0,0" Name="Ellipse2" Stroke="Blue"
                         HorizontalAlignment="Left" Width="10" Height="10" VerticalAlignment="Top"
                         Fill="Blue" />
                <Ellipse Margin="100,50,0,0" Name="Ellipse3" Stroke="Blue" Fill="Blue"
                         HorizontalAlignment="Left" Height="10" Width="10" VerticalAlignment="Top" />
                <Ellipse Margin="85.3553,85.3553,0,0" Name="Ellipse4" Stroke="Blue"
                         HorizontalAlignment="Left" Width="10" Height="10" VerticalAlignment="Top"
                         Fill="Blue" />
                <Ellipse Margin="50,100,0,0" Name="Ellipse5" Stroke="Blue" Fill="Blue"
                         HorizontalAlignment="Left" Width="10" Height="10" VerticalAlignment="Top" />
                <Ellipse Margin="14.6447,85.3553,0,0" Name="Ellipse6" Stroke="Blue"
                         HorizontalAlignment="Left" Width="10" Height="10" VerticalAlignment="Top"
                         Fill="Blue" />
                <Ellipse Margin="0,50,0,0" Name="Ellipse7" Stroke="Blue" HorizontalAlignment="Left"
                         Width="10" Fill="Blue" Height="10" VerticalAlignment="Top" />
                <Ellipse Margin="12.1447,12.1447,0,0" Name="EllipseMedium" Width="15" Height="15"
                         Stroke="Blue" HorizontalAlignment="Left" VerticalAlignment="Top" Fill="Blue" />
            </Canvas>
            <Canvas.RenderTransform>
                <RotateTransform x:Name="spin" Angle="0" CenterX="65" CenterY="65" />
            </Canvas.RenderTransform>
            <Canvas.Triggers>
                <EventTrigger RoutedEvent="Canvas.Loaded">
                    <BeginStoryboard>
                        <Storyboard>
                            <DoubleAnimationUsingKeyFrames
                                Storyboard.TargetName="SpinningProgress"
                                Storyboard.TargetProperty="(Canvas.RenderTransform).(RotateTransform.Angle)"
                                RepeatBehavior="Forever" Duration="0:0:1">
                                <DiscreteDoubleKeyFrame Value="45" KeyTime="0:0:0.125" />
                                <DiscreteDoubleKeyFrame Value="90" KeyTime="0:0:0.25" />
                                <DiscreteDoubleKeyFrame Value="135" KeyTime="0:0:0.375" />
                                <DiscreteDoubleKeyFrame Value="180" KeyTime="0:0:0.5" />
                                <DiscreteDoubleKeyFrame Value="225" KeyTime="0:0:0.675" />
                                <DiscreteDoubleKeyFrame Value="270" KeyTime="0:0:0.75" />
                                <DiscreteDoubleKeyFrame Value="315" KeyTime="0:0:0.875" />
                            </DoubleAnimationUsingKeyFrames>
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
            </Canvas.Triggers>
        </Canvas>
        <TextBlock Name="PercentDoneControl" Margin="0,0,0,100" HorizontalAlignment="Center" VerticalAlignment="Center"
                   FontSize="32" Foreground="DimGray" />
        <TextBlock Name="OperationTextControl" Margin="0,75,0,0" HorizontalAlignment="Center"
                   VerticalAlignment="Center"
                   FontSize="14" Foreground="Blue" />
        <Button Name="CancelButton" Margin="0,150,0,0" HorizontalAlignment="Center" VerticalAlignment="Center"
                FontSize="14" Width="80" Height="25" Visibility="Collapsed" Click="CancelButtonClick">
            Cancel
        </Button>
    </Grid>
</UserControl>